<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="stylesheet" href="index.css">

    <title>下载客户端</title>
</head>
<body>
    <!-- 头部区域开始 -->
   <div class="topbar">
    <div class="m-top">
       <h1 class="logo">
          <a href="../index/index.html">网易云音乐</a>
       </h1>
       <ul>
          <li>
             <a href="../index/index.html">发现音乐</a>
          </li>
          <li class="active">
             <a href="../mine/mine.html">我的音乐</a>
          </li>
          <li>
             <a href="#">关注</a>
          </li>
          <li>
             <a href="../Shopping/Shopping.html">商城</a>
          </li>
          <li>
             <a href="../musician/musician.html">音乐人</a>
          </li>
          <li class="hot">
             <a href="../download/download.html">下载客户端</a>
          </li>

       </ul>
       <div class="search">
          <span></span>
          <input type="text" placeholder="音乐/视频/电台/用户">

       </div>
       <div class="creater-center">
          <a href="../create/create.html">
             创作者中心
          </a>
       </div>
       <div class="tophead">
          <div class="user">
             <img src="./user.jpg" alt="">
          </div>
          <div class="user-list">
             <ul>
                <li>
                   <a href="#">
                      <i class="iconfont icon-gerenzhongxin"></i>
                      <em>我的主页</em>
                   </a>
                </li>
                <li>
                   <a href="#">
                      <i class="iconfont icon-xiaoxi"></i>
                      <em>我的消息</em>
                   </a>
                </li>
                <li>
                   <a href="#">
                      <i class="iconfont icon-dengji"></i>
                      <em>我的等级</em>
                   </a>
                </li>
                <li>
                   <a href="#">
                      <i class="iconfont icon-yinlehuiyuan"></i>
                      <em>VIP会员</em>
                   </a>
                </li>
                <li>
                   <a href="#">
                      <i class="iconfont icon-gerenshezhi"></i>
                      <em>个人设置</em>
                   </a>
                </li>
                <li>
                   <a href="#">
                      <i class="iconfont icon-zhuanjifenshimingrenzheng"></i>
                      <em>实名认证</em>
                   </a>
                </li>
                <li>
                   <a href="#">
                      <i class="iconfont icon-tuichu"></i>
                      <em>退出</em>
                   </a>
                </li>
             </ul>
          </div>
       </div>
    </div>
    <div class="m-top-line"></div>
 </div>
 <!-- 头部区域结束 -->
    <div class="box">


        <div class="xun">
            <img src="./images/wCRnpjXHpGRiq1c1uCkIFQ==_109951164246717547" alt="">
            <p>扫描二维码下载</p>
        </div>
        <div class="fomt">
            <div class="left">
                <p>在电脑上听</p>
                <img src="./images/109951164207162781.png" alt="" id="img1">
                <div class="img">
                    <img src="./images/icon_mac_black_new.bbaa33f484108e702bc365c250b74e79.png" alt="" id="img2">
                    <img src="./images/windows.3e335fd6d5078918ef80f7e54d0bd4b8.png" alt="" id="img3">
                </div>
                <div class="bottom">下载电脑端</div>
            </div>
            <div class="right">
                <p>在电脑上听</p>
                <img src="./images/109951164207180884.png" alt="" id="img1">
                <div class="img">
                    <img src="./images/icon_iphone_black_new.3c51a3730124d2d8d662aa4393572914.png" alt="" id="img2">
                    <img src="./images/android.f73995b4ecd8636ecb3819906598ec13.png" alt="" id="img3">
                </div>
                <div class="bottom">下载手机端</div>
            </div>
        </div>
        <div class="font">
            <ul>
                <div class="li1">
                    <div id="left">
                        <p id="p1">千万曲库 首首CD音质</p>
                        <p id="p2">囊括感受无损SQ音乐，你在用手机听歌时，</p>
                        <p id="p3">也能感受纤维毕现的CD音质，更能免费离线收听</p>
                    </div>
                    <div id="right"><img src="./images/109951164206415504.jpg" alt=""></div>
                </div>
                <div class="li2">
                    
                    <div id="left"><img src="./images/109951164488922626.jpg" alt=""></div>
                    <div id="right">
                        <p id="p1">千位明星 亲自推荐音乐</p>
                        <p id="p2">韩红，戴佩妮等千位明星已入驻，亲自创建私房歌单，录制独</p>
                        <!-- <p id="p3">也能感受纤维毕现的CD音质，更能免费离线收听</p> -->
                    </div >
                </div>
                <div class="li3">
                    <div id="left">
                        <p id="p1">社交关系 发现全新音乐</p>
                        <p id="p2">你可以关注明星、DJ和好友，通过浏览他们的动态、收藏和<br>分享，发现更多全新好音乐</p>
                        <!-- <p id="p3">也能感受纤维毕现的CD音质，更能免费离线收听</p> -->
                    </div>
                    <div id="right"><img src="./images/109951164488924083.jpg" alt=""></div>
                </div>
                <div class="li4">
                   
                    <div id="left"><img src="./images/109951164206417003.jpg" alt=""></div>
                     <div id="right">
                        <p id="p1">手机电脑 歌单实时同步</p>
                        <p id="p2">只要一个帐号，你就可以同步在手机、电脑上创建、收藏<br>的歌单，随时随地畅享好音乐</p>
                        <!-- <p id="p3">也能感受纤维毕现的CD音质，更能免费离线收听</p> -->
                     </div>
                </div>
                <div class="li5">
                    <div id="left">
                        <p id="p1"> 听歌识曲 助你疯狂猜歌</p>
                        <p id="p2">歌曲很动听却不知道歌名，歌名在嘴边却想不起来……<br>用功能，几秒钟就知道歌名</p>
                        <!-- <p id="p3">也能感受纤维毕现的CD音质，更能免费离线收听</p> -->
                    </div>
                    <div id="right"><img src="./images/109951164488904737.jpg" alt=""></div>
                </div>
            </ul>
        </div>
        <div class="foot">
            <div class="foot_left">
                <p class="p1">服务条款&nbsp;|&nbsp;隐私政策&nbsp;|&nbsp;版权投诉指引&nbsp;|&nbsp;联系我们</p>
                <p class="p2">网易公司版权所有©1997-杭州乐读科技有限公司运营：浙网文[2021] 1186-054号</p>
                <p class="p3">粤B2-20090191-18工业和信息化部备案管理系统网站</p>
            </div>
            <div class="foot_right">
                <ul>
                    <li class="i1">
                        <p>用户认证</p>
                    </li>
                    <li class="i2">
                        <p>独立音乐人</p>
                    </li>
                    <li class="i3">
                        <p>赞赏</p>
                    </li>
                    <li class="i4">
                        <p>视频奖励</p>
                    </li>
                </ul>
            </div>
        </div>



        
    </div>



</body>
</html>